<!DOCTYPE html>
<html>
	<head>
		<meta charset="utf-8">
		<title>测试Demo1</title>
		<style type="text/css">
			* {
				margin: 0;
				padding: 0;
			}
 
			#nav {
				/* 设置图片和文字水平居中显示 */
				text-align: center;
			}
 
			#nav h1 {
				margin-top: 20px;
				font-size: 20px;
				color: #16b8c7;
			}
 
			#nav img {
				/* 设置图片的宽高 */
				width: 50px;
				height: 50px;
				/* 将图片设置为圆形，设置为50%即为圆形 */
				border-radius: 50%;
			}
 
			#nav p.name {
				margin-top: 10px;
			}
 
			#nav p.title {
				color: #929292;
				font-size: 14px;
				margin-top: 12px;
			}
		</style>
	</head>
	<body>
		<div id="nav">
			<h1>测试</h1>
			<p class="name">测试</p>
			<p class="title">测试</p>
		</div>
	</body>
</html>

原文链接：https://blog.csdn.net/cnds123321/article/details/104193787